<template>
    <div>
        <!--面包屑列表-->
        <el-breadcrumb separator="/" style="margin:10px 0px 0px 10px;width:70%">
            <el-breadcrumb-item
                v-for="(item, index) in BreadList"
                :key="index"
                ><el-button type="text" @click="getData(item.path);">{{ item.name }}</el-button>
            </el-breadcrumb-item>
        </el-breadcrumb>
        <DataList :data="this.items" :path="this.path" :userInfo="this.userInfo" :total="this.total"></DataList>
    </div>
</template>
<script>
import axios from "axios";

export default {
  data() {
      return {
        items:[
            
        ],
        BreadList:[

        ],
        path:'',
        total:'',
      }
  },
  props:["userInfo"],
  methods:{
        setItems(items){
          this.items=items;
      },
      // 加上了面包屑的动态生成
      getData(now_path,page){
          this.$axios.get('/api/taoyun/v1/File/showfile', {
             params: {
                 now_path: now_path,
                 page,
                 size:10
             }
          })
          .then((res) => {
              this.path=now_path;
              // 管理面包屑
              var breadPath=[];
              var nowPath=now_path.split('/').filter(function (s) {return s && s.trim()});

              for(let i=1;i<nowPath.length;i++){
                let p='';
                for(let j=0;j<=i;j++){
                    p+=nowPath[j]+'/'
                }
                breadPath.push({"name":nowPath[i],"path":p});
              }
              this.BreadList=breadPath;
                this.items=res.data.data.list;
                this.total=res.data.data.total;
          })
          .catch((err) => {
             console.log(err);
          });
      },
  },
    created() {
        // 在渲染前先获取数据  不然渲染不出来
        this.getData("user/" + this.userInfo.userNumber + "/");
    },
};
</script>